body{
    font-family: "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB", 
                 "Hiragino Sans GB W3", "WenQuanYi Micro Hei",
                 "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;
}
a{ transition: all 0.2s ease-in-out 0s;}
@ora:#E67E22;
//top部分--------------------------------------------------------
.top{
    background:red url(../images/top.jpg) no-repeat center 20%;
//background-size的属性介绍------------------------  
//1.固定值 设置背景图像的高度和宽度。如果只设置一个值，则第二个值会被设置为 "auto"。
//2.百分比设置  设置背景图像的宽度和高度。如果只设置一个值，则第二个值会被设置为 "auto"。
//3.cover  把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中。
//4.contain  把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。
    background-size:cover;
    padding-top: 75px;padding-bottom: 75px;
}

//导航条部分--------------------------------------------------------
#leader_hide{
    float: none;
    span{
        background:#505050;height:3px;
    }   
}
#leader_list{  
    li{
        // 去除li标签的浮动属性，并设为行内块级元素。
        float: none;display: inline-block;
        a{
           padding-left: 20px;padding-left: 20px;
           color: #525252; font-size:15px;
           line-height:25px;
           &:hover{
               background:white;
               color:@ora;
           }
        } 
        .shouye{
            border-bottom:2px solid @ora;
        } 
        // 媒体查询
        @media(max-width:768px){
            display: block;text-align: left;
        } 
    }  
              
}
//主题部分-----------------------------------------------------------------
.content{
    background:#EBEBEB;
    padding-top: 35px;padding-bottom: 35px;    
    border-top:2px solid #E1E1E1;
    margin-top: -3px; 
    //  内容部分
    main{            
        article{
            margin: 0px;
            background: white;
            padding:10px 35px;
            margin-bottom:35px;
            // 标题
            h1{
                width: 100%;
                text-align: center;
                font-weight: normal;
                a{
                   color: #303030;
                   &:hover{
                       text-decoration: none;
                   }
                }  
            } 
            // 作者，时间
            .info{
                width: 100%;text-align: center;
                color:#959595;
                a{
                    color:@ora;
                }
            }
            // 文章内容
            .arti{
                width: 100%;
                p{
                    font-size: 14px;color:#444443;
                    font-size: 18px;
                } 
            }
            //  阅读全文
            .read{
                width: 100%;text-align: left;
                a{                   
                    background:@ora;color:white;  
                    border: 1px solid #e67e22;                 
                    &:hover{
                        background:#303030;
                        border: 1px solid #303030; 
                    }
                }
            }
            footer{
                padding-top: 25px;padding-bottom: 25px;
                border-top: 1px solid #EBEBEB;
                margin-top: 30px;color:#959595;
                i{
                    font-size:12px;
                }
                a{
                    color:#959595;
                    &:hover{
                        color:@ora;
                    }
                }
            }         
        }
    }
    @media (max-width:970px){
        main{
           padding-left: 0px;  
           padding-right: 0px;
        } 
    } 
    //  右侧边栏
    aside{
        // 社区部分
        .shequ{
            width: 100%;
            background: white;
            padding:20px 30px;
            h3{
                padding-bottom: 7px;position: relative;
                border-bottom: 1px solid #ebebeb;
                margin-top:0px;
                // 元素后面插入内容
                &:after{
                      content: "";
                      width: 90px;height: 1px;
                      background: #e67e22;
                      position: absolute;left: 0;bottom: -1px;
                }
            } 
            p{
                a{
                    color:@ora;
                }
            }        
        }
        // 下载区域
        .download{
            width: 100%;background:white;
            padding: 20px 30px;
            margin-top: 35px;
            h3{
                padding-bottom: 7px;position: relative;
                border-bottom: 1px solid #ebebeb;
                margin-top:0px;
                &:after{
                      content: "";
                      width: 90px;height: 1px;
                      background: #e67e22;
                      position: absolute;left: 0;bottom: -1px;
                }
                
            }
            .btn{
                 width: 100%;background:@ora;
                 border:1px solid @ora;
                 color: white;
                 transition: all 0.2s ease-in-out 0s;
                 &:hover{
                     background:#303030;
                     border: 1px solid #303030; 
                 }
            }         
        } 
        // 标签云部分
        .tags{
            width: 100%;background:white;
            padding: 20px 30px;
            margin-top: 35px;
            h3{
                padding-bottom: 7px;position: relative;
                border-bottom: 1px solid #ebebeb;
                margin-top:0px;
                &:after{
                      content: "";
                      width: 90px;height: 1px;
                      background: #e67e22;
                      position: absolute;left: 0;bottom: -1px;
                }               
            }
            p{
                width: 100%;overflow: hidden;
                a{
                    display: block;float: left;
                    margin: 5px 5px 0px 0px;
                    padding: 5px 10px;
                    color: #959595; border: 1px solid #EBEBEB;
                    font-size:14px;
                    &:hover{
                        color: white;background: @ora;
                        text-decoration: none;
                        border: 1px solid @ora;
                    }
                }
            }
        }
    }
}

//footer部分----------------------------------------------------------
.footer{
    background: #1F1F1F;
    padding-top: 35px;padding-bottom: 35px;
    //  共用的头部标题
    .foot_new,.foot_par,.foot_tag{
        padding-left:45px;padding-right:45px;
        margin-bottom: 30px;
        h3{
            padding-bottom: 7px;position: relative;
            border-bottom: 1px solid #303030;
            margin-top:0px;margin-bottom: 15px;
            color:white;
            &:after{
                  content: "";
                  width: 90px;height: 1px;
                  background: #e67e22;
                  position: absolute;left: 0;bottom: -1px;
            }               
        }
    }
    //  最新文章部分
    .foot_new{
        p{
            padding-top:5px;padding-bottom:15px;
            border-bottom: 1px dashed #303030;
            a{
                display: block;color: #959595;
                line-height:25px; 
                &:hover{
                    color:@ora;
                    text-decoration: none;
                }
            }
            span{
                line-height:25px; 
                display: block;
                color: #505050;
            }
        }
    }
    // foot部分的tag
    .foot_tag{
        p{
            width: 100%;overflow: hidden;
            a{
                display: block;float: left;
                margin: 5px 5px 0px 0px;
                padding: 5px 10px;
                color: #959595; border: 1px solid #303030;
                font-size:14px;
                &:hover{
                    color: white;background: @ora;
                    border: 1px solid @ora;
                    text-decoration: none;
                }
            }
        }
    }
    //  合作伙伴部分
    .foot_par{
        p{
            padding-top:5px;padding-bottom:15px;
            border-bottom: 1px dashed #303030;
            a{
                color: #959595; padding: 5px;
                line-height: 30px;margin-right:10px;
                // 强制不换行
                white-space:nowrap;
                &:hover{
                    background:@ora;color: white;
                    text-decoration: none;
                }
            }
        }
        p.par_last{
            border: none;
        }
    }
}

//copyright部分
.copyright{
    background:#101010;color:#555555;
    border-top:1px solid #303030;
    padding-top: 30px;padding-bottom: 30px;
    text-align: center;
    a{
        color: #555555;
    }
}



//测试区域
.red{
    background: red;
}
.blue{
    background: blue;
}
.green{
    background: green;
}
